<template>
	<view>
		<view class="cardTitle">设备信息</view>
		<form @submit="tapUserTwo">
			<view class="baoCard">
				<view class="cardContent">
					<view class="cardFont"><text class="baoxing">*</text>设备</view>
					<view style="display: flex;align-items: center;">
						<input class="inputin" v-model="form.shebei" type="text" name="xinghao" placeholder="请填写设备型号"
							placeholder-style="color:#999;font-size:28upx;" />
		
					</view>
				</view>
				<view class="cardContent">
					<view class="cardFont"><text class="baotou">*</text>故障类型</view>
					<view @tap="choose3" style="display: flex;align-items: center; ">
						<text class="otherFont" v-if="list3!='请选择故障类型'">{{list3}}</text>
						<text class="baoFont" v-else>请选择故障类型</text>
					</view>
				</view>
				<view class="cardContent">
					<view class="cardFont"><text class="baotou">*</text>维保类型</view>
					<view @tap="choose1" style="display: flex;align-items: center;">
						<text class="otherFont">sadfadsf</text>
						<!-- <text class="baoFont" v-else>请选择维保类型</text> -->
					</view>
				</view>
				<view class="cardContent">
					<view class="cardFont"><text class="baotou">*</text>维保状态</view>
					<view @tap="choose2" style="display: flex;align-items: center;">
						<text class="otherFont" v-if="list2!='请选择维保状态'">{{list2}}</text>
						<text class="baoFont" v-else>请选择维保状态</text>
					</view>
				</view>
				<view class="cardContent">
					<view class="cardFont"><text class="baotou">*</text>服务方式</view>
					<view @tap="choose3" style="display: flex;align-items: center; ">
						<text class="otherFont" v-if="list3!='请选择服务方式'">{{list3}}</text>
						<text class="baoFont" v-else>请选择服务方式</text>
					</view>
				</view>
			</view>
			<!-- <view class="baoContent">
				<button class="baoBt bottom"  formType="submit">我要报修</button>
			</view> -->
		</form>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				form:{
					shebei:''
				}
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="scss">
.baoCard{
	margin:30upx 30upx 0 30upx;
	background:rgba(255,255,255,1);
	border:1upx solid rgba(239,239,239,1);
	box-shadow:0upx 4upx 12upx 0upx rgba(0, 0, 0, 0.1);
	border-radius:10upx;
}
.cardPosion{
	position:absolute;
	top: 0;
	right: 0;
	border-radius:0px 10upx 0px 10upx;
	color: #fff;
	font-size:22upx;
	padding:5upx 10upx;
}
.cardColora{
	background-color:#9FE3C7;
}
.cardMsg{
	padding:30upx 0;
	margin: 0 30upx;
	font-weight: bold;
	font-size: 32upx;
	border-bottom: 1upx solid #EFEFEF;
}
.cardShow{
	padding-right: 30upx;
}
.cardCenter{
	margin: 0 30upx;
	display: flex;
	justify-content: space-between;
}
.cardText{
	font-size: 28upx;
	font-weight: bold;
	color: #999;
}
.cardContent{
	padding:30upx 0;
	margin: 0 30upx;
	display: flex;
	justify-content: space-between;
	border-top: 1upx solid #EFEFEF;
}
.cardTitle{
	color: #333333;
	font-size: 36upx;
	padding: 10upx 0 0 10upx;
	font-weight: bold;
	font-family: PingFang SC;
	position: relative;
	left: 24rpx;
}
.cardFont{
	font-weight: bold;
	font-size: 32upx;
	letter-spacing: 2upx;
}
.otherFont{
	/* font-weight: bold; */
	font-size: 32upx;
	letter-spacing: 2upx;
	width: 300upx;
	white-space:nowrap;/* 不换行 */
	overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */
	text-overflow:ellipsis;
	text-align:right;
}
.inputin{
	text-align: right;
}
.baoFont{ /*灰色字体*/
	font-size: 28upx;
	color: #999;
}
.baoxing{ /*那个颜色的*  */
	color:#FF1F01;
	font-weight: bold;
}
.baotou{ /*那个颜色的*  */
	color:#fff;
	font-weight: bold;
}
</style>
